<!DOCTYPE html>
<html lang="en">

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0">
	<meta name="renderer" content="webkit" />
	<meta name="force-rendering" content="webkit" />
	<title></title>
	<link type="text/css" rel="stylesheet" href="${base}/templates/${config.theme}/mobile/css/style.css" />
	<script src="${base}/templates/${config.theme}/mobile/js/jquery.min.js"></script>
	<script type="text/javascript">
		$(document).ready(function() {
			$('.gwccheck').click(function() {
				if ($(this).attr("class") == "gwccheck on") {
					$(this).removeClass('on');
				} else {
					$(this).addClass('on');
				}
			})
		})
	</script>
</head>

<body>
<div class="headerbox">
	<div class="header">
		<div class="headerL">
			<a onclick="javascript:history.back(-1)" class="goback"><img src="${base}/templates/${config.theme}/mobile/images/goback.png" /></a>
		</div>
		<div class="headerC">
			<p>购物车</p>
		</div>
		<div class="headerR"></div>
	</div>
</div>
<div class="clear"></div>
<div class="hbox"></div>
<div class="kbox"></div>
<div class="gwcbox">
	<div class="gwcbox_1">
		<div class="gwc1_2">

		[#if currentCart.cartItems?? && currentCart.cartItems?size>0]
		    [#list currentCart.cartItems as cartItem]
				<div class="gwcone">
					<div class="go1">
						<div class="gwccheck"></div>
					</div>
					<div class="go2"><a href="${base}${cartItem.product.path}"><img src="${cartItem.product.image}" /></a></div>
					<div class="go3">
						<div class="go3_1">
							<a href="${base}${cartItem.product.path}">
								<p class="p1">${cartItem.product.name}</p>
							</a>
							<p class="p2">￥${cartItem.product.price}</p>
						</div>
						<div class="go3_2">
							<p class="p3">口味：烧烤味</p>
						</div>
						<div class="go3_3">
							<div class="num1" onclick="changeQuantity(${cartItem.productId},'-')">-</div>
							<div class="num2" id="cartItem_quantity_${cartItem.productId}" data="${cartItem.quantity}">${cartItem.quantity}</div>
							<div class="num3" onclick="changeQuantity(${cartItem.productId},'+')">+</div>
							<div class="del" onclick="javascript:if (confirm('您确实要把该商品移出购物车吗？')) deleteCartItem(${cartItem.id},'redirect');"><img src="${base}/templates/${config.theme}/mobile/images/del.png" /></div>
						</div>
					</div>
				</div>
			 [/#list]
		[/#if]

		</div>
	</div>
</div>
<div class="fbox1"></div>
<div class="hejiBox">
	<div class="heji">
		<div class="heji_1">
			<div class="gwccheck on"></div>
		</div>
		<div class="heji_2">全选</div>
		<div class="heji_3">
			<p>合计：<span id="totalPrice">￥${currentCart.totalPrice}</span></p>
		</div>
		<!-- <div class="heji_4">为您节省￥605.2</div> -->
		<div class="heji_5">
			<a [#if currentCart.cartItems?? && currentCart.cartItems?size>0 &&currentCart.totalPrice>0] href="${base}/order/add" [/#if]>去结算(${currentCart.quantity})</a>
		</div>
	</div>
</div>
<div class="footbox">
	<div class="footer">
		<ul>
			<li>
				<a href="${base}/">
					<img src="${base}/templates/${config.theme}/mobile/images/f01.png" />
					<p>首页</p>
				</a>
			</li>
			<li>
				<a href="${base}/category">
					<img src="${base}/templates/${config.theme}/mobile/images/f02.png" />
					<p>分类</p>
				</a>
			</li>
			<li class="on">
				<a href="${base}/cart/list">
					<div id="cartQuantity"></div>
					<img src="${base}/templates/${config.theme}/mobile/images/f3.png" />
					<p>购物车</p>
				</a>
			</li>
			<li>
				<a href="${base}/member">
					<img src="${base}/templates/${config.theme}/mobile/images/f04.png" />
					<p>我的</p>
				</a>
			</li>
		</ul>
	</div>
</div>
</body>

<script type="text/javascript">

	loadCart();

	function loadCart(){
		//ajax
		$.ajax({
			url: "${base}/cart/view",
			type: "GET",
			dataType: 'json',
			success: function(data){
				$("#cartQuantity").text(data.quantity);
			}
		});

	}

	//数量增加减
	function changeQuantity(productId,operate){
		var cartItemNum = $("#cartItem_quantity_"+productId);;
		if("+"==operate){
			cartItemNum.html(Number(cartItemNum.html())+1);
			cartItemNum.attr("data",Number(cartItemNum.html())+1)
		}else if("-"==operate){
			if(cartItemNum.html()==0){
				return;
			}
			cartItemNum.html(Number(cartItemNum.html())-1);
			cartItemNum.attr("data",Number(Number(cartItemNum.html())-1));
		}
		updateChangeQuantity(productId,cartItemNum.html());
	}

	function changePrice(productId){
		var cartItemNum = $("#cartItem_quantity_"+productId);
		var quantity = cartItemNum.html();
		var reg = /^\+?[1-9][0-9]*$/;　　//正整数
		if(!reg.test(quantity)){
			alert("请输入数字!")
			cartItemNum.html(cartItemNum.attr("data"));
			return;
		}
		updateChangeQuantity(productId,quantity);
	}

	//更新购物车数量
	function updateChangeQuantity(productId,quantity){
		$.ajax({
			url: "/cart_item/update",
			type: "POST",
			data: {"productId":productId,"quantity":quantity,"type":2},
			success: function(data){
				$("#cartItem_subtotal_"+productId).html("￥"+data.subtotal);
				$("#totalPrice").html("￥"+data.totalPrice);
			}
		});
	}

	//删除购物项
	function deleteCartItem(cartItemId,type){
		//ajax

		$.ajax({
			url: "/cart_item/delete",
			type: "POST",
			data: {"id":cartItemId},
			success: function(data){
				if(type=="ajax"){
					loadCart();
				}else if(type="redirect"){
					location.href="/cart/list"
				}
			}
		});

	}

</script>

</html>